<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/reset.css" />
		<link rel="stylesheet" type="text/css" href="css/layui.css" />
		<link rel="stylesheet" type="text/css" href="css/stylew.css" />
	</head>

	<body>
		<!--预约看房弹出框-->
		<form class="layui-form order-box" action="">
			<h1>预约看房</h1>
			<span>个人基本信息*</span>
			<div class="layui-form-item">
				<label class="layui-form-label">您的称呼：</label>
				<div class="layui-input-inline">
					<input type="text" placeholder="请输入您的称呼" class="layui-input" lay-verify="required" />
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">联系方式：</label>
				<div class="layui-input-inline">
					<input type="text" placeholder="请输入联系方式" class="layui-input" lay-verify="required" />
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">验证码：</label>
				<div class="layui-input-inline" style="width: 126px;">
					<input type="text" placeholder="请输入验证码" class="layui-input" lay-verify="required" />
				</div>
				<div class="layui-form-mid layui-word-aux">获取验证码</div>
			</div>
			<div class="order-time">
				<p>本次预约看房时间</p>
				<ul>
					<li class="on" onclick="timeC(this)">
						<label>星期一</label>
						<b>19</b>
						<em>07月</em>
					</li>
					<li onclick="timeC(this)">
						<label>星期二</label>
						<b>20</b>
						<em>07月</em>
					</li>
					<li onclick="timeC(this)">
						<label>星期三</label>
						<b>21</b>
						<em>07月</em>
					</li>
					<li onclick="timeC(this)">
						<label>星期四</label>
						<b>22</b>
						<em>07月</em>
					</li>
					<li onclick="timeC(this)">
						<label>星期五</label>
						<b>23</b>
						<em>07月</em>
					</li>
					<li onclick="timeC(this)">
						<label>星期六</label>
						<b>24</b>
						<em>07月</em>
					</li>
					<li onclick="timeC(this)">
						<label>星期日</label>
						<b>25</b>
						<em>07月</em>
					</li>
				</ul>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">看房时间：</label>
				<div class="layui-input-inline">
					<input type="text" placeholder="请选择具体预约看房时间" class="layui-input" lay-verify="required" onclick="layui.laydate({elem: this, istime: true, format: 'YYYY-MM-DD hh:mm:ss'})" />
				</div>
			</div>
			<div class="layui-form-item" style="margin-bottom: 5px;">
				<label class="layui-form-label">预约要求</label>
			</div>
			<div class="layui-form-item">
				<textarea placeholder="请填写您的约看要求" class="layui-textarea" lay-verify="required"></textarea>
			</div>
			<div class="layui-form-item" style="margin-top: 18px;">
				<button class="layui-btn" lay-submit="" lay-filter="demo1">确认预约</button>
			</div>
		</form>
		<script type="text/javascript" src="js/jquery.min.js"></script>
		<!--点击出现大图-->
		<script src="js/layui.js"></script>
		<script type="text/javascript">
			layui.use(['form', 'layer', 'laydate'], function() {
				var form = layui.form,
					layer = layui.layer,
					laydate = layui.laydate;
				$('.loadimg').on('click', function() {
					layer.open({
						type: 2,
						title: '',
						shadeClose: true,
						shade: 0.3,
						area: ['690px', '560px'], //宽高
						content: 'showMore.html'
					});
				})
			});
			//选择预约看房时间
			function timeC(e) {
				$('.order-time ul li').removeClass('on');
				$(e).addClass('on');
			}
		</script>
	</body>

</html>